<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>力邦测控研发中心文件仓库</title>
    <!-- Required CSS files -->
    <link rel="stylesheet" href="{% static 'css/owl.carousel.css' %}">
    <link rel="stylesheet" href="{% static 'css/barfiller.css' %}">
    <link rel="stylesheet" href="{% static 'css/animate.css' %}">
    <link rel="stylesheet" href="{% static 'css/font-awesome.4.7.0.css' %}">
    <link rel="stylesheet" href="{% static 'css/bootstrap-4.2.1.css' %}">
    <link rel="stylesheet" href="{% static 'css/slicknav.css' %}">
    <link rel="stylesheet" href="{% static 'css/main.css' %}">
    <link href="{% static 'layui/css/layui.css' %}" rel="stylesheet"/>
    <script src="{% static 'js/jquery-3.3.1.min.js' %}"></script>
    <link rel="stylesheet" href="{% static 'sweetalert/sweetalert.css' %}">
    <script src="{% static 'sweetalert/xtalert.js' %}"></script>
    <script src="{% static 'sweetalert/sweetalert.min.js' %}"></script>
    <script src="{% static 'layui/layui.js' %}" type="text/javascript"></script>
    {% block static %}
        <style>
            .layui-form-label {
                width: 100px;
            }

            .layui-form-select {
                width: 500px;
            }

            .progress-bar-success {
                background-color: #5cb85c;
            }
            a {
                text-decoration:none;
            }
        </style>
    {% endblock %}
</head>
<body>
<div class="preloader">
    <span class="preloader-spin"></span>
</div>
<div class="site">
    <header>
        <div class="container">
            <div class="row">
                <nav id="menu" class="d-none d-lg-block">
                    <ul>
                        <li class="current-menu-item">
                            <a href="{% url 'myadmin:index' %}" style="text-decoration:none">力邦测控研发中心文件仓库</a>
                    </ul>
                </nav>
                <div class="col-6 col-sm-9 nav-column clearfix">
                    <nav id="menu" class="d-none d-lg-block">
                        <ul>
                            <li><a href="{% url 'myadmin:upload_file' %}">上传</a></li>
                            <li><a href="{% url 'myadmin:File_List' %}">下载</a></li>
                            {% if request.session.user %}
                                <li class="current-menu-item has-child">
                                    <a href="">
                                        <img src="{% static 'img/head.jpeg' %}"
                                             class="layui-nav-img">
                                        {{ request.session.user }}</a>
                                    <ul class="sub-menu">
                                        <li><a href="">基本资料</a></li>
                                        <li><a href="{% url 'myadmin:Check_Password' %}">密码修改</a></li>
                                        <li><a href="{% url 'myadmin:User_Permissions' %}">权限修改</a></li>
                                    </ul>
                                </li>
                                <li id="exit">
                                    <a href="#">退出</a>
                                </li>
                            {% else %}
                                <li><a href="{% url 'myadmin:User_Login' %}">登录</a></li>
                            {% endif %}
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
    </header>
</div>
{% block body %}
    <div style="width:610px;margin: 190px auto;">
        <form class="layui-form" method="post" action="{% url 'myadmin:upload_file' %}">
            <div class="layui-inline">
                <label class="layui-form-label" style="">搜索文件：</label>
                <div class="layui-input-inline" style="width: 30%">
                    <select name="name" lay-verify="required" lay-search="">
                        <option value="">直接选择或搜索选择</option>
                        {% for foo in folder %}
                            <option value="{{ foo }}">{{ foo }}</option>
                        {% endfor %}
                    </select>
                    <div class="layui-form-mid layui-word-aux" style="width: 140%">小主，如需新建项目文件，请联系管理员</div>
                </div>

            </div>

            <div class="layui-form-item">
                <label class="layui-form-label" style="">文件上传：</label>
                <div class="layui-inline" id="upload_parent" style="width:500px;height: 140px">
                    <div class="layui-upload-drag" id="upload">
                        <i class="layui-icon"></i>
                        <p>点击上传，或将文件拖拽到此处</p>
                    </div>
                    <span id="upload_span" class="" style="font-size: 25px;margin-left: 30px">请选择文件 <i
                            style="font-size: 25px;"
                            class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i></span>
                </div>
                <div class="layui-inline" id="upload_preview"></div>
            </div>
            {#  进度条             #}
            <div class="progress" style="width: 82%;
    margin: 0 17%;">
                <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar"
                     aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
                    0%
                </div>
            </div>
            <div class="layui-form-item" style="margin-top: 5%">
                <label class="layui-form-label" style=""></label>
                <div class="layui-input-inline">
                    <button type="submit" class="layui-btn layui-btn-disabled" disabled="" id="submit" lay-submit="" lay-filter="demo1">立即提交
                    </button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
    </div>

{% endblock %}
</div>
<script>
    //定义一个函数
    function sleep() {
        window.location.reload();
    }

    $('#exit').click(function () {
        $.ajax({
            url: "{% url 'myadmin:User_Logout' %}",//路径
            type: "GET", //提交方式
            success: function (result) {//返回数据根据结果进行相应的处理
                if (result.code = 200) {
                    xtalert.alertSuccessToast("退出成功，欢迎下次光临小店！");
                    setTimeout(sleep, 1200)
                }
            },
            error: function (error) {
                layer.msg("500，请稍后尝试")
            }
        });
    })
</script>
<!--Required JS files-->

<script src="{% static 'js/vendor/popper.min.js' %}"></script>
<script src="{% static 'js/vendor/bootstrap.min.js' %}"></script>
<script src="{% static 'js/vendor/owl.carousel.min.js' %}"></script>
<script src="{% static 'js/vendor/isotope.pkgd.min.js' %}"></script>
<script src="{% static 'js/vendor/jquery.barfiller.js' %}"></script>
<script src="{% static 'js/vendor/loopcounter.js' %}"></script>
<script src="{% static 'js/vendor/slicknav.min.js' %}"></script>
<script src="{% static 'js/active.js' %}"></script>
<script>
    // 文件上传
    layui.use('upload', function () {
        var $ = layui.jquery,
            upload = layui.upload;

        var sitv = '';
        //拖拽上传
        upload.render({
            elem: '#upload'
            , url: '/upload/' //改成您自己的上传接口
            , accept: 'file' //普通文件
            , auto: true // 是否自动上传
            // 上传前回调函数
            , before: function (res) {
                $('.progress-bar').css('width', '0%');
                $('.progress-bar').text('0%');
                layer.load(2);
                $('#upload_span').html('上传中,请等待' + '<i style="font-size: 40px;" style="margin-left: 30px;" class="layui-icon layui-icon-file-b"></i>');
                $('#upload_span').css('color', 'red');

                $('#upload i').empty();
                $('#upload i').append('<i style="font-size: 40px;" class="layui-icon layui-icon-file-b"></i>');
                $('#upload p').text('上传中,请等待！！！');
                $('#upload_parent').css('width', '500px', 'height', '140px');
                $('#upload').css('width', '258px', 'height', '136px');

            }
            // 上传完 回调函数
            , done: function (res) {
                layer.closeAll('loading'); //关闭loading

                $('.progress-bar').css('width', '100%');
                $('.progress-bar').text('100%');

                layer.msg('上传成功,请点击提交');
                $('#upload_span').html('上传成功' + '<i style="font-size: 25px;" class="layui-icon layui-icon-ok-circle"></i>');
                $('#upload_span').css('color', '#5FB878');

                $('#upload i').empty();
                $('#upload i').append('<i style="font-size: 40px;" class="layui-icon layui-icon-ok-circle"></i>');
                $('#upload p').text('上传成功,请点击提交。');
                var item = this.item;

                $('#submit').removeAttr("disabled");
                $('#submit').removeClass("layui-btn-disabled")

            }
        });

    });
</script>
<script>
    layui.use(['form'], function () {
        var form = layui.form;
        form.render();

    });

</script>
</body>

</html>




